<template name="Meteorstrap">
  {{#if Template.subscriptionsReady}}
    {{> _Meteorstrap}}
  {{else}}
    <p>{{_ 'loading'}}</p>
  {{/if}}
</template>

<template name="_Meteorstrap">
  <div class="meteorstrap">
    <div class="container-fluid">
      <div class="row">
        <div class="col-sm-12">
          <button class="btn btn-default btn-lg dropdown-toggle pull-left margin-right-20" type="button" data-toggle="dropdown">
            {{_ 'editing'}} <b>{{editingTheme.name}}{{#if canReset}}<i> - {{_ 'edited'}}</i>{{/if}}</b> <span class="caret"></span>
          </button>
          <ul class="dropdown-menu">
            <li class="dropdown-header">{{_ 'tools'}}</li>
            <li><a class='clone-theme' href="#">
              <i class='glyphicon glyphicon-file'></i> {{_ 'clone_theme'}}
            </a></li>

            {{#if canReset}}
              <li><a class='reset-theme' href="#">
                <i class='glyphicon glyphicon-repeat'></i> {{_ 'reset_theme'}}
              </a></li>
            {{/if}}

            {{#unless editingTheme.predefined}}
            <li><a class='delete-theme' href="#">
              <i class='glyphicon glyphicon-trash'></i> {{_ 'delete_theme'}}
            </a></li>
            {{/unless}}

            {{#unless editingTheme.default}}
              <li><a class='make-default' href="#">
                <i class='glyphicon glyphicon-star'></i> {{_ 'make_default'}}
              </a></li>
            {{/unless}}

            <li class="divider"></li>

            <li class="dropdown-header">{{_ 'change_theme'}}</li>
            {{#each availableThemes}}
              <li><a class='change-theme' href="#">
                <span title='{{#if predefined}}This is a predefined theme which cannot be deleted{{else}}This is a user defined theme{{/if}}'>
                  {{#if default}}<i class='glyphicon glyphicon-star'></i> {{/if}}
                  {{#unless predefined}}<i class='glyphicon glyphicon-user'></i> {{/unless}}{{name}} <small class='text-muted'>{{_ 'by_author' author}}</small>
                </span>
              </a></li>
           {{/each}}
          </ul>
        </div>
      </div>
      {{#with editingTheme}}
        <div class="row css-boxes">
          <div class="col-sm-6">
            <label>{{_ 'custom_less'}} {{#if error}}<span class='label label-danger'>{{_ 'error_rendeirng_theme'}}</span>{{/if}}</label>
            <textarea class='form-control css-box' name='customLess'>{{customLess}}</textarea>
          </div>
          <div class="col-sm-6">
            <label>Theme LESS</label>
            <textarea class='form-control css-box' name='bootswatch' disabled="true">{{bootswatch}}</textarea>
          </div>
        </div>
      {{/with}}
    </div>

    {{> BootstrapMagic}}
  </div>
</template>

<template name="MeteorstrapCloneModal">
  <form>
    <div class="modal-header">
      <button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
      <h4 class="modal-title">{{_ 'clone theme'}}</h4>
    </div>
    <div class="modal-body">
      <p>{{_ 'clone_description'}}</p>
      <p><b>{{theme.name}}</b></p>
      <p>{{_ 'clone_prompt'}}</p>
      <div class="row">
        <div class="col-xs-6">
          <input type="text" class="input-block form-control" name="name" placeholder="{{_ 'theme_name'}}">
        </div>
        <div class="col-xs-6">
          <input type="text" class="input-block form-control" name="author" placeholder="{{_ 'author'}}">
        </div>
      </div>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-default pull-left" data-dismiss="modal">{{_ 'cancel'}}</button>
      <button type="submit" class="btn btn-success confirm-clone">{{_ 'clone_theme'}}</button>
    </div>
  </form>
</template>





